<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"
    />
    <style>
      * {
        -webkit-user-select: none;
      }
      html,
      body {
        background-color: transparent;
        margin: 0;
        padding: 0;
      }
    </style>
    <script src="https://turing.captcha.qcloud.com/TCaptcha.js"></script>
  </head>
  <body>
    <script type="text/javascript">
      const bridgeMethod = (method, data) => {
        if (window.webkit) {
          window.webkit.messageHandlers[method].postMessage(data);
        } else if (window.messageHandlers) {
          window.messageHandlers[method](JSON.stringify(data));
        } else {
          console.log(method, data);
        }
      };

      const bridgeOnLoaded = (data) => bridgeMethod("onLoaded", data);
      const bridgeOnSuccess = (data) => bridgeMethod("onSuccess", data);
      const bridgeOnFail = (data) => bridgeMethod("onFail", data);

      const verify = (configJsonString) => {
        let config = JSON.parse(configJsonString);
        config = Object.assign(config, {
          ready: (data) => {
            bridgeOnLoaded(data);
          },
        });
        let appId = config.appId;
        delete config.appId;
        const txCaptcha = new TencentCaptcha(
          appId,
          (res) => {
            if (res.ret === 0) {
              bridgeOnSuccess(res);
            } else {
              bridgeOnFail(res);
            }
          },
          config,
        );
        txCaptcha.show();
      };

      window._verify = verify;
    </script>
  </body>
</html>
